<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		div[class^=font] {   /*匹配开头*/
			color: pink;
		}
		div[class$=footer] {   /*匹配结尾*/
			color: skyblue;
		}
		div[class*=tao] {   
			color: green;
		}
	</style>
</head>
<body>
	<div class="font12">属性选择器</div>
	<div class="font12">属性选择器</div>
	<div class="font24">属性选择器</div>
	<div class="font24">属性选择器</div>
	<div class="font24">属性选择器</div>
	<div class="24font">属性选择器123</div>
	<div class="sub-footer">属性选择器</div>
	<div class="jd-footer">属性选择器</div>
	<div class="news-tao-nav">属性选择器</div>
	<div class="tao-header">属性选择器</div>
</body>
</html>